// main.js
import { h } from 'vue';

import { CheckmarkCircleOutline, CloseCircleOutline, TimeOutline, WarningOutline } from '@vicons/ionicons5';
import dayjs from 'dayjs';
import { isFunction } from 'lodash-es';
import { NAvatar, NBadge, NButton, NIcon, NImage, NInput, NProgress, NRate, NSelect, NSwitch, NTag } from 'naive-ui';
import VxeUI from 'vxe-pc-ui';

// 日期渲染器
VxeUI.renderer.add('Date', {
	// 默认显示模板
	renderTableDefault(renderOpts, params) {
		const data = params.row[params.column.field];
		return data ? dayjs(data).format('YYYY-MM-DD HH:mm:ss') : '--';
	},
});

// 标签渲染器
VxeUI.renderer.add('Tag', {
	renderTableDefault(renderOpts, params) {
		const { props } = renderOpts;
		return h(
			NTag,
			{
				...props,
			},
			{ default: () => params.row[params.column.field] }
		);
	},
});

// 开关渲染器
VxeUI.renderer.add('Switch', {
	renderTableDefault(renderOpts, params) {
		const { props, events } = renderOpts;

		const { onUpdateValue, ...restProps } = (isFunction(props) ? props(params) : props) ?? {};
		return h(NSwitch, {
			...restProps,
			value: !!params.row[params.column.field],
			onUpdateValue: (value: any) => {
				if (onUpdateValue) {
					onUpdateValue(value, params);
				} else {
					params.row[params.column.field] = value;
				}
			},
			...events,
		});
	},
});

// 输入框渲染器
VxeUI.renderer.add('Input', {
	renderTableDefault(renderOpts, params) {
		const { props, events } = renderOpts;

		const { onUpdateValue, ...restProps } = props ?? {};
		return h(NInput, {
			...restProps,
			value: params.row[params.column.field],
			onUpdateValue: (value) => {
				if (onUpdateValue) {
					onUpdateValue(value, params);
				} else {
					params.row[params.column.field] = value;
				}
			},
			...events,
		});
	},
});

// 下拉框渲染器
VxeUI.renderer.add('Select', {
	renderTableDefault(renderOpts, params) {
		const { props, events, options } = renderOpts;

		const { onUpdateValue, ...restProps } = props ?? {};
		return h(NSelect, {
			options,
			value: params.row[params.column.field],
			onUpdateValue: (value) => {
				if (onUpdateValue) {
					onUpdateValue(value, params);
				} else {
					params.row[params.column.field] = value;
				}
			},
			...restProps,
			...events,
		});
	},
});

// 头像渲染器
VxeUI.renderer.add('Avatar', {
	renderTableDefault(renderOpts, params) {
		const { props, events } = renderOpts;
		return h(NAvatar, {
			...props,
			...events,
			src: params.row[params.column.field],
		});
	},
});

// 图片渲染器
VxeUI.renderer.add('Image', {
	renderTableDefault(renderOpts, params) {
		const { props, events } = renderOpts;
		return h(NImage, {
			...props,
			...events,
			src: params.row[params.column.field],
			preview: true,
		});
	},
});

export default VxeUI;
